{% extends base.html %}

{% block head %}
<style type="text/css">
    .plugin {
        margin-top: 5px;
    }

    .nav-path {
        padding: 5px;
        box-sizing: border-box;
        background-color: #eee;
    }

    .main {
        padding-left: 0px;
        padding-right: 0px;
    }

</style>
{% end %}

{% block body %}
{% import os %}
<input class="hide" id="path" value="{{path}}">
<div class="col-md-12 nav-path">
    <!-- <a href="/fs/{{os.path.dirname(path)}}">返回</a>  -->
    文件路径: {{path}}
</div>

<div class="col-md-12">
    {% for index, item in enumerate(scripts) %}
        <button class="plugin btn" data-name="{{item}}">{{get_display_name(item)}}</button>
    {% end %}
</div>

<div id="resultDiv" class="col-md-12">
    <div class="output-title">
        结果
        <a id="pluginEditLink" class="hide link float-right" href="#">编辑脚本</a>
    </div>
    <div id="result" class="col-md-12 output-body">
    </div>
</div>

<script type="text/javascript">

    function showResult(text) {
        $("#resultDiv").show();
        $("#result").html(text);
    }

    $(".plugin").click(function (event) {
        var name = $(event.target).attr("data-name");
        var path = $("#path").val();
        showResult("开始执行 " + name);
        runPlugin(name, false);
        $("#pluginEditLink").removeClass("hide")
            .attr("href", "/system/script/edit?name=" + name);
    });

    function runPlugin(name, confirmed) {
        if (name == "") {
            return;
        }
        var path = $("#path").val();
        var inputText = $("#inputText").val();
        showResult("开始执行 " + name + " ...");
        $.post("/fs_api/run_plugin", 
            {
                name: name,
                path: path,
                confirmed: confirmed,
                input: inputText
            },
            function (result) {
                showResult(result.data);
            });
    }
</script>

{% end %}